<template>
    <div>
        <rui-page :defines="defines" v-show="!prototypeShow">
            <rui-query :label-width="150"
                       ref="searchFormPlan"
                       :query="queryData"
                       :query-rows="queryRows"
                       :more-rows="moreRows"
            >
            </rui-query>
            <Row>
                <Alert show-icon>
                    已选择 <span class="select-count">{{selectCount}}</span> 项
                    <a class="select-clear" @click="clearSelectAll">清空</a>
                </Alert>
            </Row>
            <rui-table :loading="loading"
                       :defineId="'defineProductPrototypeTable'"
                       :fixedLeft="['action']"
                       :fixedRight="[]"
                       :showIndex="false"
                       :columns="prototypeColumns"
                       :slots="[{key:'action',slot:'action'},{key:'productName',slot:'productName'}]"
                       @loadDatas="queryData"
                       @on-selection-change="changeSelect"
                       ref-query="searchFormPlan"
                       ref="productPrototypeTable"
            >
                <template slot="toolBar">
                    <Button @click="addPrototy" type="primary" icon="md-add">新增</Button>
                    <Button @click="effective" type="primary">有效</Button>
                    <Button @click="invalid" type="primary">无效</Button>
                    <circleLoading v-if="operationLoading"/>
                </template>
                <template slot="action" slot-scope="{ row }">
                    <div>
                        <Button @click="view(row)" size="small" type="primary"
                                v-show="row.status!=0&&row.status!=1">查看
                        </Button>
                        <Button @click="edit(row)" size="small" type="primary"
                                v-show="row.status==0||row.status==1">编辑
                        </Button>
                        <Button @click="copy(row)" type="primary">复制</Button>
                    </div>
                </template>
                <template slot-scope="{ row, index }" slot="productName">
                    <a @click="view(row)">
                        {{row.productName}}
                    </a>
                </template>
            </rui-table>
            <Modal
                v-model="prototypeModalVisible"
                :title="modalTitle"
                :closable="false"
                :width="1100"
                :mask-closable="false"
                @on-ok="copyPrototype"
            >
                <rui-form :form-options="prototypeFormOptions" :read-only="false"
                          ref="prototypeForm"></rui-form>
                <div slot="footer">
                    <Button size="small" @click="prototypeModalVisible = false">取消</Button>
                    <Button type="primary" :loading="submitLoading" size="small" @click="copyPrototype">保存</Button>
                </div>
            </Modal>
            <Modal
                v-model="templateShow"
                :title="modalTitle"
                :closable="false"
                :width="1000"
                :mask-closable="false"
            >
                <rui-query :label-width="180" ref="searchTemplateForm"
                           :query="queryTemplateData" :query-rows="searchFormOptions"/>
                <rui-table
                    :defineId="'defineParentTemplate'"
                    :fixedLeft="['action']"
                    :showIndex="false"
                    :columns="parentTemplateColumns"
                    @loadDatas="queryTemplateData"
                    @on-selection-change="changeTemplateSelect"
                    ref-query="searchTemplateForm"
                    ref="parentTemplateTable"
                >
                </rui-table>
                <Row class="operation" style="text-align: center;">
                    <Button @click="next" type="primary" icon="md-fastforward">下一步</Button>
                    &nbsp;&nbsp;
                    <Button @click="cancel" type="primary" icon="md-rewind">取消</Button>
                </Row>
                <div slot="footer">
                </div>
            </Modal>
        </rui-page>
        <productPrototype ref="productPrototype" v-if="prototypeShow" :parentParam="parentParam" @backPage="backPage"></productPrototype>
    </div>
</template>

<script>
    import productPrototypeDefine from "./define/product-prototype-query-define";
    import productPrototypeTableDefine from "./define/product-prototype-table-define";

    import defineParentTemplate from "../defines/parent-template-define";
    import {deepClone} from "@/libs/utils/ObjectClone";
    import productPrototype from "./productPrototype.vue";
    import circleLoading from "_c/circle-loading/circle-loading.vue";
    import {getListProductTemplate} from "@/projects/afs-core-business/api/afs-product/product/product";
    import {
        copyPrototype,
        effective,
        invalid,
        queryProductPrototypeList,
    } from "@/projects/afs-core-business/api/afs-product/product/productPrototype";

    export default {
        name: "product-plan",
        components: {
            productPrototype,
            circleLoading
        },
        data() {
            return {
                defines: [],
                loading:true,
                operationLoading: false,
                submitLoading: false,
                templateShow: false,
                prototypeModalVisible: false,
                modalTitle: null,
                prototypeShow: false,
                selectCount: 0,
                selectTemplateCount: 0,
                parentParam: null,
                repaymentMethod: null,
                queryRows: [
                    {
                        defineId: "defineProductPrototype",
                        span: 8,
                        fields: [ "status", "productName","productNumber"]
                    },
                ],
                moreRows: [
                    {
                        defineId: "defineProductPrototype",
                        span: 8,
                        fields: ["businessType", "carType", "carNature"]
                    },
                    {
                        defineId: "defineProductPrototype",
                        span: 8,
                        fields: ["interestRateType", "repaymentMethod","discountCategory"]
                    },
                    {
                        defineId: "defineProductPrototype",
                        span: 8,
                        fields: [ "additionalLoanOrNot","templateName","createTimeQuery"]
                    }
                ],
                prototypeColumns: [
                    'action', 'productNumber', 'productName','businessTypes','carTypes','carNatures','interestRateType',
                    'repaymentMethod', 'discountType','loanPeriodMin','loanPeriodMax','downPayRatioMin', 'additionalLoanOrNot', 'templateName', 'status', 'createTime', 'updateTime'
                ],
                prototypeFormOptions: [
                    {
                        grids: [
                            // {
                            //     defineId: "defineProductPrototype",
                            //     span: 12,
                            //     fields: ["productNumber"]
                            // },
                            {
                                defineId: "defineProductPrototype",
                                span: 12,
                                fields: ["productName"]
                            },
                        ]

                    }
                ],
                searchFormOptions: [
                    {defineId: "defineParentTemplate", fields: ["templateNumber", "templateName"]}
                ],
                parentTemplateColumns: ['templateNumber', 'templateName', 'templateCategory', 'versionNumber'],
            };
        },
        methods: {
            refresh() {
                this.$refs['productPrototypeTable'].reloadData();
                this.clearSelectAll();
            },
            queryData(queryData) {
                console.log(queryData);
                this.loading=true;
                queryProductPrototypeList(queryData).then(res => {
                    this.loading=false;
                    if (res.code === "0000") {
                        let {records, total} = res.data;
                        this.$refs.productPrototypeTable.updateTableData(records, total);
                    }
                });
            },
            changeSelect(e) {
                this.selectList = e;
                this.selectCount = e.length;
            },
            changeTemplateSelect(e) {
                this.selectTemplateList = e;
                this.selectTemplateCount = e.length;
            },
            effective() {
                if (this.selectCount <= 0) {
                    this.$Message.warning("您还未选择要设置有效的数据");
                    return;
                }
                this.$Modal.confirm({
                    title: "确认设置有效吗",
                    content: "您确认要设置有效所选的 " + this.selectCount + " 条数据?",
                    onOk: () => {
                        let ids = [];
                        this.selectList.forEach((e) => {
                            ids += e.id + ",";
                        });
                        ids = ids.substring(0, ids.length - 1);
                        this.operationLoading = true;
                        effective({ids: ids}).then(res => {
                            this.operationLoading = false;
                            if (res.code === "0000") {
                                this.$Message.success("设置成功");
                                this.refresh();
                            }
                        }).catch(() => {
                            this.operationLoading = false;
                        });
                    }
                });
            },
            invalid() {
                if (this.selectCount <= 0) {
                    this.$Message.warning("您还未选择要设置无效的数据");
                    return;
                }
                this.$Modal.confirm({
                    title: "确认设置无效吗",
                    content: "您确认要设置无效所选的 " + this.selectCount + " 条数据?",
                    onOk: () => {
                        let ids = [];
                        this.selectList.forEach((e) => {
                            ids += e.id + ",";
                        });
                        ids = ids.substring(0, ids.length - 1);
                        this.operationLoading = true;
                        invalid({ids: ids}).then(res => {
                            this.operationLoading = false;
                            if (res.code === "0000") {
                                this.$Message.success("设置成功");
                                this.refresh();
                            }
                        }).catch(() => {
                            this.operationLoading = false;
                        });
                    }
                });
            },
            view(v) {
                this.prototypeShow = true;
                this.parentParam = {
                    status: '3',
                    productTemplateId: v.productTemplateId,
                    id: v.id,
                    templateCategory: v.templateCategory,
                    op:'view'
                };
            },
            edit(v) {
                this.prototypeShow = true;
                this.parentParam = {
                    status: '2',
                    productTemplateId: v.productTemplateId,
                    id: v.id,
                    templateCategory: v.templateCategory,
                    op:'edit'
                };
            },
            copy(row) {
                this.prototypeModalVisible = true;
                this.$refs.prototypeForm.resetFrom();
                this.$refs.prototypeForm.updateFormData(deepClone(row));
                this.$refs.prototypeForm.setFiledValue('productNumber', null);
                this.$refs.prototypeForm.setFieldRequired('productName', true);
            },
            copyPrototype() {
                this.submitLoading = true;
                copyPrototype(this.$refs.prototypeForm.getFormData()).then(res => {
                    this.submitLoading = false;
                    if (res.code === "0000") {
                        this.$Message.success("设置成功");
                        this.prototypeModalVisible = false;
                        this.refresh();
                    }
                }).catch(() => {
                    this.submitLoading = false;
                });
            },
            addPrototy() {
                this.selectTemplateCount = 0;
                this.templateShow = true;
                this.prototypeShow = false;
                this.$refs['parentTemplateTable'].reloadData();
                this.$refs.parentTemplateTable.getTable().selectAll(false);
            },
            clearSelectAll() {
                this.$refs.productPrototypeTable.getTable().selectAll(false);
            },
            queryTemplateData(queryData) {
                console.log(queryData);
                getListProductTemplate(queryData
                ).then(res => {
                    if (res.code === "0000") {
                        let {records, total} = res.data;
                        this.$refs.parentTemplateTable.updateTableData(records, total);
                    }
                });
            },
            next() {
                if (this.selectTemplateCount <= 0) {
                    this.$Message.warning("您还未选择数据！");
                    return;
                } else if (this.selectTemplateCount > 1) {
                    this.$Message.warning("您只能选择一笔数据！");
                    return;
                }
                let id = null;
                let templateCategory = null;
                this.selectTemplateList.forEach((e) => {
                    id = e.id;
                    templateCategory = e.templateCategory;
                });
                this.templateShow = false;
                this.prototypeShow = true;
                this.status = '1';
                this.parentParam = {status: '1', productTemplateId: id, templateCategory: templateCategory,op:'add'};

            },
            cancel() {
                this.templateShow = false;
                this.prototypeShow = false;
                this.refresh();
            },
            backPage() {
                this.templateShow = false;
                this.prototypeShow = false;
                this.refresh();
            },

        },
        mounted() {
            this.refresh();
        },
        created() {
            this.defines.push(
                {
                    id: 'defineProductPrototype',
                    fields: productPrototypeDefine
                },
                {
                    id: 'defineProductPrototypeTable',
                    fields: productPrototypeTableDefine
                },
                {
                    id: 'defineParentTemplate',
                    fields: defineParentTemplate
                }
            );
        }
    };
</script>
